<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      //一.类的静态成员
      //静态成员: 1静态属性  2.静态方法
      //静态成员: 属于类的特征  不属于实例化对象的特征  静态成员的调用不需要实例化
      //ES5里的静态成员
      //

      // function Person(name) {
      //   this.name = name;
      // }
      // //把函数当成对象来使用
      // Person.num = 10; //静态属性
      // Person.fn = function () {
      //   //静态方法
      //   console.log("fn");
      // };
      // console.dir(Person);
      // console.log(Person.num);
      // Person.fn();

      //
      // ES6修饰静态成员: static
      // class Person {
      //   static num = 10;
      //   constructor(name) {
      //     this.name = name;
      //   }
      //   static fn() {
      //     console.log("fn静态方法");
      //   }
      // }
      // console.log(Person.num);
      // Person.fn();

      //静态成员的作用

      //通过全局变量来统计
      // let instanceNum = 0;
      // class Person {
      //   constructor(name) {
      //     this.name = name;
      //     instanceNum++;
      //     // this.num = 0;
      //     // this.num++;不可取  变量太多会造成变量污染
      //   }
      // }

      //同级Person类实例化的次数
      // let zhangsan = new Person("张三");
      // let lisi = new Person("李四");
      // let wangwu = new Person("王五");
      // console.log(instanceNum);

      //
      //2.实现一个单例模式(单体模式)
      //单例模式 :保证一个类 只有一个实例化对象
      // window  document
      class Person {
        static instance;
        constructor(name) {
          this.name = name;
          if (!Person.instance) {
            Person.instance = this;
          } else {
            return Person.instance;
          }
        }
      }
      let zhangsan = new Person("张三");
      let lisi = new Person("李四");
      let wangwu = new Person("王五");
      console.log(zhangsan, lisi, wangwu);
    </script>
  </body>
</html>
